<template>
  <div class="content" style="width: 750px;margin-left: 40px;margin-top: 20px">
    <dl class="company_center_content">
      <dt>
        <h1>
          <em></em>
          未读简历 <span>（共{{pageInfo.size}}份）</span></h1>
      </dt>
      <dd>
        <form action="haveRefuseResumes.html" method="get" id="filterForm">

          <div class="filter_actions ">
            <a id="resumeDelAll" ></a>
            <span>简历投递记录</span>

            <div id="filter_btn" @click="selResumeType">筛选简历 <em></em></div>
          </div><!-- end .filter_actions -->
          <el-collapse-transition>
            <div class="filter_options"  v-show="selType">
              <dl>
                <dt>工作经验：</dt>
                <dd>
                  <a rel="-1" class="current" href="javascript:;">不限</a>
                  <a rel="1" href="javascript:;">应届毕业生</a>
                  <a rel="2" href="javascript:;">一年以下</a>
                  <a rel="3" href="javascript:;">1-3年</a>
                  <a rel="4" href="javascript:;">3-5年</a>
                  <a rel="5" href="javascript:;">5-10年</a>
                  <a rel="6" href="javascript:;">10年以上</a>
                  <input type="hidden" value="-1" name="workExp">
                </dd>
              </dl>
              <dl>
                <dt>最低学历：</dt>
                <dd>
                  <a rel="-1" class="current" href="javascript:;">不限</a>
                  <a rel="1" href="javascript:;">大专及以上</a>
                  <a rel="2" href="javascript:;">本科及以上</a>
                  <a rel="3" href="javascript:;">硕士及以上</a>
                  <a rel="4" href="javascript:;">博士及以上</a>
                  <input type="hidden" value="-1" name="eduExp">
                </dd>
              </dl>
              <input type="hidden" value="0" name="filterStatus" id="filterStatus">
              <input type="hidden" value="" name="positionId" id="positionId">
            </div><!-- end .filter_options -->
          </el-collapse-transition>
          <ul class="reset resumeLists" style="margin-top: 20px">
            <el-alert
                    v-if="pageInfo.list.length==0"
                    title="当前暂无简历投递"
                    type="warning"
                    center
                    show-icon>
            </el-alert>
            <li data-id="1686182" class="onlineResume"
                v-for="item in pageInfo.list"
                :key="item.position.positionId&&item.resume.userId">

              <div class="resumeShow">
                <a title="预览在线简历" target="_blank" class="resumeImg" @click="goPreview()">
                  <img v-if="item.resume.headerImg"
                       :src="$config.url+item.resume.headerImg">
                  <div v-else><img src="../../resume/img/default_headpic.png"></div>
                </a>
                <div class="resumeIntro">
                  <h3 class="unread">
                    <a target="_blank" title="预览jason的简历" @click="goPreview()">
                      {{item.resume.name}}的简历
                    </a>
                    <em></em>
                  </h3>
                  <span class="fr">投递时间：{{makeDate(item.applicationTime)}}</span>
                  <div>
                    {{item.resume.name}} /
                    {{item.resume.sex}} /
                    {{item.resume.maxDegree}} /
                    {{item.resume.workExp}} <br>
                    {{item.jobClassify}}
                  </div>
                  <div class="jdpublisher">
                    <span>应聘职位：
                      <a title="随便写" target="_blank"
                         @click="goPositionDetail(item.position.positionId)">
                      {{item.position.positionName}}
                      </a>
                    </span>
                  </div>
                </div>
                <div class="links">
                  <el-popconfirm title="移入待处理吗？"
                                 @confirm="setApplicationOne(item.position.positionId,item.resume.userId)">
                    <el-button slot="reference" type="info" size="mini" round>待处理</el-button>
                  </el-popconfirm>

                  <el-popconfirm title="标记为面试？"
                                 @confirm="setApplicationTwo(item.position.positionId,item.resume.userId)">
                    <el-button slot="reference" type="success" size="mini" round>面试</el-button>
                  </el-popconfirm>

                  <el-popconfirm title="标记为不合适？"
                                 @confirm="setApplicationThree(item.position.positionId,item.resume.userId)">
                    <el-button slot="reference" type="warning" size="mini" round>不合适</el-button>
                  </el-popconfirm>
                </div>
              </div>
              <el-dialog :visible.sync="preview" style="">
                <preview :userId="item.resume.userId"></preview>
              </el-dialog>
            </li>
          </ul><!-- end .resumeLists -->
        </form>
      </dd>
    </dl><!-- end .company_center_content -->
    <div style="float: right">
      <el-pagination
              background
              layout="prev, pager, next"
              :total="pageInfo.total"
              :page-size="pageInfo.pageSize"
              @current-change="handlePage"
      >
      </el-pagination>
    </div>
    <!--弹窗：预览简历-->

  </div><!-- end .content -->
</template>

<script>
  import {makeSimpleDate,makeDate} from "../../../common/js/dateformat"
  import preview from "../../userWork/preview"
  export default {
    name: "no-resume",
    components:{
      preview
    },
    data(){
      return{
        loading:false,
        selType:false,
        hrId:'',
        pageIndex:1,
        pageInfo:{},
        preview:false,//预览简历弹窗
      }
    },
    created(){
      this.hrId=this.$store.state.hr.hrId;
      this.selApplicantByHr();
    },
    methods:{
      selResumeType(){
        this.selType=!this.selType;
      },
      selApplicantByHr(){
        this.loading=true;
        this.$ajax.post(this.$config.url + `/applicants/selApplicantByHr/${this.pageIndex}`,{
          "hrId":this.hrId
        }).then(res => {
              this.pageInfo=res.data;
              this.loading = false;
            }).finally(() => {
        })
      },
      goPositionDetail(positionId) {
        this.$router.push(`/positionDetail/${positionId}`)
      },
      //设为待处理
      setApplicationOne(positionId,userId){
        console.log(positionId,userId);
        this.$ajax.post(this.$config.url + `/applicants/setApplicantIsEmployOne`,{
          "positionId":positionId,
          "userId":userId
        }).then(res => {
          if(res.data.message=="succ"){
            this.$message.success("设置成功");
            this.selApplicantByHr();
          }else{
            this.$message.error("出错了，设置失败")
          }
        }).finally(() => {
        })
      },
      //设为通知面试
      setApplicationTwo(positionId,userId){
        console.log(positionId,userId);
        this.$ajax.post(this.$config.url + `/applicants/setApplicantIsEmployTwo`,{
          "positionId":positionId,
          "userId":userId
        }).then(res => {
          if(res.data.message=="succ"){
            this.$message.success("设置成功");
            this.selApplicantByHr();
          }else{
            this.$message.error("出错了，设置失败")
          }
        }).finally(() => {
        })
      },
      //设为不合适
      setApplicationThree(positionId,userId){
        console.log(positionId,userId);
        this.$ajax.post(this.$config.url + `/applicants/setApplicantIsEmployThree`,{
          "positionId":positionId,
          "userId":userId
        }).then(res => {
          if(res.data.message=="succ"){
            this.$message.success("设置成功");
            this.selApplicantByHr();
          }else{
            this.$message.error("出错了，设置失败")
          }
        }).finally(() => {
        })
      },
      goPreview(){
        this.preview=!this.preview;
      },
      dataUtil(date) {
        return makeSimpleDate(date)
      },
      makeDate(date){
        return makeDate(date)
      },
      handlePage(val) {
        //console.log(val)
        this.pageIndex = val
        //加载数据
        this.selApplicantByHr()
      },
    }
  }
</script>

<style scoped>
  .company_center_content{background-color:#fafafa;margin-top:5px;position:relative}
  .company_center_content>dt{height:47px;position:absolute;z-index:1;top:-5px;left:40px;background-color:#91cebe}
  .company_center_content>dt h1{color:#fff;font-size:24px;font-weight:normal;line-height:47px;padding:0 20px;margin:0}
  .company_center_content>dt em{background:url(../img/title_arrow_new.png) no-repeat;width:4px;height:5px;position:absolute;left:-4px;top:0}
  .company_center_content>dt span{font-size:14px}
  .company_center_content>dd{min-height:337px;padding:70px 0;position:relative}
  .company_center_content>dd .ccc_tr{position:absolute;right:20px;top:20px}
  .company_center_content>dd .ccc_tr span{color:#019875;font-weight:600}
  .company_center_content
  .company_center_content .no_resume_tip span{font-size:14px;color:#999}
  .company_center_content .no_resume_tip a{color:#019875;text-decoration:underline}
  #filter_btn{float:right;font-weight:600;color:#555;margin-right:20px;position:relative;padding-right:16px;cursor:pointer;*margin:-40px 40px 0 0}
  #filter_btn:hover{color:#333}
  #filter_btn em{height:0;width:0;font-size:0;line-height:0;border-width:5px 5px 0;border-style:solid dashed;border-color:#9f9f9f transparent transparent;-webkit-transition:all .4s ease 0s;-moz-transition:all .4s ease 0s;-ms-transition:all .4s ease 0s;transition:all .4s ease 0s;position:absolute;right:0;top:10px;overflow:hidden}
  #filter_btn em.transform{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:all .4s ease 0s;-moz-transition:all .4s ease 0s;-ms-transition:all .4s ease 0s;transition:all .4s ease 0s}

  .filter_actions{background:#f2f2f2;padding:15px 20px;position:relative}
  .filter_actions label.checkbox i{background:url(../img/checkbox.png) 0 0 no-repeat}
  .filter_actions span{float:left;margin:0 0 0 12px;font-weight:600;color:#555}
  .filter_actions a{color:#fff;background:#91cebe;display:inline-block;padding:1px 10px;margin-left:20px;-webkit-transition:.2s;-moz-transition:.2s;transition:.2s}
  .filter_actions a:hover{background:#019875}
  ul.resumeLists li .resumeShow{padding:10px;background:#fff; margin-left:30px;*width:632px;*float:left; *margin-left:15px;}
  ul.resumeLists li .resumeShow a.resumeImg{position:relative;width:90px;height:90px;float:left;}
  ul.resumeLists li.fileResume .resumeShow a.resumeImg{position:relative;width:70px;height:70px;}
  ul.resumeLists li .resumeShow img{width:90px;height:90px;position:absolute;}
  ul.resumeLists li.fileResume .resumeShow img{width:70px;height:70px;position:absolute;float:left; }
  ul.resumeLists li.onlineResume .resumeIntro{margin-left:100px;}
  ul.resumeLists li.fileResume .resumeIntro{margin-left:80px;}
  ul.resumeLists li{padding:0 40px 0 20px; margin-bottom:25px; *overflow:hidden;}/* ie7下简历看不见的bug */
  .resumeIntro h3{width:370px;margin:0;font-weight:normal;}
  .resumeIntro h3.unread{font-weight:600;}
  .resumeIntro h3 a{color:#019875;font-size:18px; margin-right:10px;}
  .resumeIntro span{margin:-20px 0 0 0;font-size:12px;color:#999;}
  .fileResume .resumeIntro h3{margin-bottom:3px;}
  ul.resumeLists .resumeIntro h3.unread em{width:17px;height:17px;background:url(../img/unread.png) right top no-repeat;display:inline-block;*display:inline;*zoom:1;}
  ul.resumeLists .resumeIntro h3.read em{width:17px;height:17px;background:url(../img/unread.png) right -20px no-repeat;display:inline-block;*display:inline;*zoom:1;}
  .fileResume .resumeIntro span{	margin-top:-30px;}
  .resumeIntro .jdpublisher{width:300px;*width:280px;height:22px;word-wrap:break-word;overflow:hidden;}
  .resumeIntro .jdpublisher a{word-break:break-all;}
  .contactInfo .fr{*margin:-25px 10px 0 0;}
  .resumeLists .links{float:right;margin-top:-25px;}
  .resumeLists .links a{text-decoration:none;}
  .resumeLists .links a:hover{text-decoration:underline;}
  .resumeLists a.resume_forward{position:relative;}
  .resumeLists a.resume_forward span{color:#777777;}
  .resumeLists a.resume_forward dl{max-width:280px;cursor:default;border:2px solid #cdcccc;color:#555555;position:absolute;z-index:10;top:20px;left:-10px; *text-decoration:none;*min-width:200px;}
  .resumeLists a.resume_forward dt{background:#f2f2f2;font-size:16px;padding:6px 10px;border-bottom:1px dashed #cccccc;}
  .resumeLists a.resume_forward dd{background:#fff;padding:3px 10px;}
  .resumeLists a.resume_forward dd ul{margin:0;padding:0;list-style:none;}
  .resumeLists a.resume_forward dd ul li{padding:3px 0 3px 12px;margin:0;background:url(../img/resume_square.png) left 14px no-repeat;}
  /*.checkbox i{display:none;width:17px;height:14px;background:url(../img/checkbox.png) 0 -14px no-repeat;position:absolute;left:1px;top:-1px}*/
  .checkbox input[type="checkbox"]{width:17px;height:17px;margin:0;border:0;position:absolute;left:-2px;top:-2px;filter:alpha(Opacity=0);}
  .checkbox{float:left;width:13px;height:13px;border:2px solid #e0e0e0;background:#fff;position:relative;margin-top:3px}
  .filter_options{border-top:1px solid #f7f7f7;background:#f2f2f2;padding:15px 50px 10px}
  .filter_options dl{overflow:hidden;margin-bottom:10px}
  .filter_options dl dt{width:80px;font-size:14px;font-weight:600;float:left}
  .filter_options dl dd{margin-left:75px}
  .filter_options dd a{float:left;padding:0 8px;margin-right:10px;white-space:nowrap;-webkit-transition:all .2s ease 0s;-moz-transition:all .2s ease 0s;-ms-transition:all .2s ease 0s;transition:all .2s ease 0s}
  .filter_options dd a.current,.filter_options dd a:hover{color:#fff;background:#019875}
  div{ font:14px/22px "微软雅黑","宋体",Arial; color:#333;}
</style>